<html>

<head>

  <meta charset="utf-8" />

  <title></title>

  <style type="text/css">
    .cro {

      width: 100px;

      height: 100px;

      border: 1px solid #58C4E6;

      position: relative;

    }

    .cro_left_top,
    .cro_right_top,
    .cro_left_bottom,
    .cro_right_bottom {

      position: absolute;

      width: 20px;

      height: 20px;

      border: 1px solid #fff;

      z-index: 1;

      background: #fff;

    }

    .cro_left_top {

      top: -1px;

      left: -1px;

      border-radius: 0px 0px 20px 0px;

      border-bottom: 1px solid #58C4E6;

      border-right: 1px solid #58C4E6;

    }

    .cro_right_top {

      top: -1px;

      right: -1px;

      border-radius: 0px 0px 0px 20px;

      border-bottom: 1px solid #58C4E6;

      border-left: 1px solid #58C4E6;

    }

    .cro_left_bottom {

      left: -1px;

      bottom: -1px;

      border-radius: 0px 20px 0px 0px;

      border-top: 1px solid #58C4E6;

      border-right: 1px solid #58C4E6;

    }

    .cro_right_bottom {

      right: -1px;

      bottom: -1px;

      border-radius: 20px 0px 0px 0px;

      border-top: 1px solid #58C4E6;

      border-left: 1px solid #58C4E6;

    }
  </style>

</head>

<body>

  <div class="cro">

    <div class="cro_left_top"></div>

    <div class="cro_right_top"></div>

    <div class="cro_left_bottom"></div>

    <div class="cro_right_bottom"></div>

  </div>

</body>

</html>